let component = 'account'
let isBindCalendar = false
import { initAccount, getUserAccount } from './account.js'
import initPassword from './password.js'
import {default as country} from './country.js'

let createAccount = async () => {
    let res = await getUserAccount()
    console.log(res)
    let div = document.createElement('div')
    div.className = 'setting-account'
    let top = document.createElement('div')
    top.className = 'account-top'
    top.innerHTML = '账户设置'
    let bottom = document.createElement('div')
    bottom.className = 'account-btm'
    //
    /*
        <div class='account-btm-div5'>
            <svg style="width: 21px;height:21px;margin-left:20px" aria-hidden="true">
                <use xlink:href="#icon-dengluguge"></use>
            </svg>
            <span class='account-google'>链接谷歌日历，同步CLO的汉语课程安排</span>
        </div>
    */
    bottom.innerHTML = `
        <div class='account-btm-div1'>
            <span >账户形象</span>
            <div class='account-btm-right'>
                <img width='130' height='120' class='account-image' src='${res && res.teacherimg ? res.teacherimg : '/static/defaultavatar.png'}' />
                <div class='account-upload'>上传</div>
            </div>
        </div>
        <div class='account-btm-div2'>
            <span>名字</span>
            <input class='account-input1' value='${res ? res.username : ''}'  type='text' placeholder='inyu'/>
            <span style='margin-left:20px'>姓</span>
            <input class='account-input2' type='text' placeholder='in' />
        </div>
        <div class='account-btm-div3'>
            <span>邮箱</span>
            <input class='account-input3' type='text' value='${res ? res.mailbox : ''}'  placeholder='xxx@example.com'/>
        </div>
        <div class='account-btm-div4'>
            <span>手机号码</span>
            <div class='account-btm-div4-tel-wrap'>
                <div class='account-btm-div4-tel'>
                    <div class='account-btm-div4-left react-tel-input'>
                        <div class='account-btm-div4-country-icon br'></div>
                        <i class='iconfont icon-xiangxia account-btm-div4-allow'></i>
                    </div>
                    <input class='account-input4' value='${res.phone}' placeholder='+82 010-1234-4567' />
                </div>
                <div class='account-btm-div4-tel-list-wrap react-tel-input'>
                </div>
            </div>
        </div>
        <div class='account-btm-div4'>
            <span>时区</span>
            <select>
                <option value="/api/private/tutortimezone/383/">Africa/Abidjan GMT +0:00</option>
                <option value="/api/private/tutortimezone/384/">Africa/Accra GMT +0:00</option>
                <option value="/api/private/tutortimezone/385/">Africa/Addis_Ababa GMT +3:00</option>
                <option value="/api/private/tutortimezone/386/">Africa/Algiers GMT +1:00</option>
                <option value="/api/private/tutortimezone/387/">Africa/Asmara GMT +3:00</option>
                <option value="/api/private/tutortimezone/509/">Africa/Asmera GMT +3:00</option>
                <option value="/api/private/tutortimezone/388/">Africa/Bamako GMT +0:00</option>
                <option value="/api/private/tutortimezone/389/">Africa/Bangui GMT +1:00</option>
                <option value="/api/private/tutortimezone/390/">Africa/Banjul GMT +0:00</option>
                <option value="/api/private/tutortimezone/391/">Africa/Bissau GMT +0:00</option>
                <option value="/api/private/tutortimezone/392/">Africa/Blantyre GMT +2:00</option>
                <option value="/api/private/tutortimezone/393/">Africa/Brazzaville GMT +1:00</option>
                <option value="/api/private/tutortimezone/394/">Africa/Bujumbura GMT +2:00</option>
                <option value="/api/private/tutortimezone/382/">Africa/Cairo GMT +2:00</option>
                <option value="/api/private/tutortimezone/395/">Africa/Casablanca GMT +1:00</option>
                <option value="/api/private/tutortimezone/396/">Africa/Ceuta GMT +1:00</option>
                <option value="/api/private/tutortimezone/397/">Africa/Conakry GMT +0:00</option>
                <option value="/api/private/tutortimezone/398/">Africa/Dakar GMT +0:00</option>
                <option value="/api/private/tutortimezone/399/">Africa/Dar_es_Salaam GMT +3:00</option>
                <option value="/api/private/tutortimezone/400/">Africa/Djibouti GMT +3:00</option>
                <option value="/api/private/tutortimezone/401/">Africa/Douala GMT +1:00</option>
                <option value="/api/private/tutortimezone/402/">Africa/El_Aaiun GMT +1:00</option>
                <option value="/api/private/tutortimezone/403/">Africa/Freetown GMT +0:00</option>
                <option value="/api/private/tutortimezone/404/">Africa/Gaborone GMT +2:00</option>
                <option value="/api/private/tutortimezone/405/">Africa/Harare GMT +2:00</option>
                <option value="/api/private/tutortimezone/406/">Africa/Johannesburg GMT +2:00</option>
                <option value="/api/private/tutortimezone/407/">Africa/Juba GMT +2:00</option>
                <option value="/api/private/tutortimezone/408/">Africa/Kampala GMT +3:00</option>
                <option value="/api/private/tutortimezone/409/">Africa/Khartoum GMT +2:00</option>
                <option value="/api/private/tutortimezone/410/">Africa/Kigali GMT +2:00</option>
                <option value="/api/private/tutortimezone/411/">Africa/Kinshasa GMT +1:00</option>
                <option value="/api/private/tutortimezone/412/">Africa/Lagos GMT +1:00</option>
                <option value="/api/private/tutortimezone/413/">Africa/Libreville GMT +1:00</option>
                <option value="/api/private/tutortimezone/414/">Africa/Lome GMT +0:00</option>
                <option value="/api/private/tutortimezone/415/">Africa/Luanda GMT +1:00</option>
                <option value="/api/private/tutortimezone/416/">Africa/Lubumbashi GMT +2:00</option>
                <option value="/api/private/tutortimezone/417/">Africa/Lusaka GMT +2:00</option>
                <option value="/api/private/tutortimezone/418/">Africa/Malabo GMT +1:00</option>
                <option value="/api/private/tutortimezone/419/">Africa/Maputo GMT +2:00</option>
                <option value="/api/private/tutortimezone/420/">Africa/Maseru GMT +2:00</option>
                <option value="/api/private/tutortimezone/421/">Africa/Mbabane GMT +2:00</option>
                <option value="/api/private/tutortimezone/422/">Africa/Mogadishu GMT +3:00</option>
                <option value="/api/private/tutortimezone/423/">Africa/Monrovia GMT +0:00</option>
                <option value="/api/private/tutortimezone/424/">Africa/Nairobi GMT +3:00</option>
                <option value="/api/private/tutortimezone/425/">Africa/Ndjamena GMT +1:00</option>
                <option value="/api/private/tutortimezone/426/">Africa/Niamey GMT +1:00</option>
                <option value="/api/private/tutortimezone/427/">Africa/Nouakchott GMT +0:00</option>
                <option value="/api/private/tutortimezone/428/">Africa/Ouagadougou GMT +0:00</option>
                <option value="/api/private/tutortimezone/429/">Africa/Porto-Novo GMT +1:00</option>
                <option value="/api/private/tutortimezone/430/">Africa/Sao_Tome GMT +0:00</option>
                <option value="/api/private/tutortimezone/510/">Africa/Timbuktu GMT +0:00</option>
                <option value="/api/private/tutortimezone/431/">Africa/Tripoli GMT +2:00</option>
                <option value="/api/private/tutortimezone/432/">Africa/Tunis GMT +1:00</option>
                <option value="/api/private/tutortimezone/433/">Africa/Windhoek GMT +2:00</option>
                <option value="/api/private/tutortimezone/34/">America/Adak GMT -10:00</option>
                <option value="/api/private/tutortimezone/35/">America/Anchorage GMT -9:00</option>
                <option value="/api/private/tutortimezone/36/">America/Anguilla GMT -4:00</option>
                <option value="/api/private/tutortimezone/37/">America/Antigua GMT -4:00</option>
                <option value="/api/private/tutortimezone/38/">America/Araguaina GMT -3:00</option>
                <option value="/api/private/tutortimezone/39/">America/Argentina/Buenos_Aires GMT -3:00</option>
                <option value="/api/private/tutortimezone/40/">America/Argentina/Catamarca GMT -3:00</option>
                <option value="/api/private/tutortimezone/41/">America/Argentina/ComodRivadavia GMT -3:00</option>
                <option value="/api/private/tutortimezone/42/">America/Argentina/Cordoba GMT -3:00</option>
                <option value="/api/private/tutortimezone/43/">America/Argentina/Jujuy GMT -3:00</option>
                <option value="/api/private/tutortimezone/44/">America/Argentina/La_Rioja GMT -3:00</option>
                <option value="/api/private/tutortimezone/45/">America/Argentina/Mendoza GMT -3:00</option>
                <option value="/api/private/tutortimezone/46/">America/Argentina/Rio_Gallegos GMT -3:00</option>
                <option value="/api/private/tutortimezone/47/">America/Argentina/Salta GMT -3:00</option>
                <option value="/api/private/tutortimezone/48/">America/Argentina/San_Juan GMT -3:00</option>
                <option value="/api/private/tutortimezone/49/">America/Argentina/San_Luis GMT -3:00</option>
                <option value="/api/private/tutortimezone/50/">America/Argentina/Tucuman GMT -3:00</option>
                <option value="/api/private/tutortimezone/51/">America/Argentina/Ushuaia GMT -3:00</option>
                <option value="/api/private/tutortimezone/52/">America/Aruba GMT -4:00</option>
                <option value="/api/private/tutortimezone/53/">America/Asuncion GMT -3:00</option>
                <option value="/api/private/tutortimezone/54/">America/Atikokan GMT -5:00</option>
                <option value="/api/private/tutortimezone/55/">America/Atka GMT -10:00</option>
                <option value="/api/private/tutortimezone/56/">America/Bahia GMT -3:00</option>
                <option value="/api/private/tutortimezone/57/">America/Bahia_Banderas GMT -6:00</option>
                <option value="/api/private/tutortimezone/58/">America/Barbados GMT -4:00</option>
                <option value="/api/private/tutortimezone/59/">America/Belem GMT -3:00</option>
                <option value="/api/private/tutortimezone/60/">America/Belize GMT -6:00</option>
                <option value="/api/private/tutortimezone/61/">America/Blanc-Sablon GMT -4:00</option>
                <option value="/api/private/tutortimezone/62/">America/Boa_Vista GMT -4:00</option>
                <option value="/api/private/tutortimezone/63/">America/Bogota GMT -5:00</option>
                <option value="/api/private/tutortimezone/64/">America/Boise GMT -7:00</option>
                <option value="/api/private/tutortimezone/65/">America/Buenos_Aires GMT -3:00</option>
                <option value="/api/private/tutortimezone/66/">America/Cambridge_Bay GMT -7:00</option>
                <option value="/api/private/tutortimezone/67/">America/Campo_Grande GMT -4:00</option>
                <option value="/api/private/tutortimezone/68/">America/Cancun GMT -5:00</option>
                <option value="/api/private/tutortimezone/69/">America/Caracas GMT -4:00</option>
                <option value="/api/private/tutortimezone/70/">America/Catamarca GMT -3:00</option>
                <option value="/api/private/tutortimezone/71/">America/Cayenne GMT -3:00</option>
                <option value="/api/private/tutortimezone/72/">America/Cayman GMT -5:00</option>
                <option value="/api/private/tutortimezone/73/">America/Chicago GMT -6:00</option>
                <option value="/api/private/tutortimezone/74/">America/Chihuahua GMT -7:00</option>
                <option value="/api/private/tutortimezone/75/">America/Coral_Harbour GMT -5:00</option>
                <option value="/api/private/tutortimezone/76/">America/Cordoba GMT -3:00</option>
                <option value="/api/private/tutortimezone/77/">America/Costa_Rica GMT -6:00</option>
                <option value="/api/private/tutortimezone/78/">America/Creston GMT -7:00</option>
                <option value="/api/private/tutortimezone/79/">America/Cuiaba GMT -4:00</option>
                <option value="/api/private/tutortimezone/80/">America/Curacao GMT -4:00</option>
                <option value="/api/private/tutortimezone/81/">America/Danmarkshavn GMT +0:00</option>
                <option value="/api/private/tutortimezone/82/">America/Dawson GMT -7:00</option>
                <option value="/api/private/tutortimezone/83/">America/Dawson_Creek GMT -7:00</option>
                <option value="/api/private/tutortimezone/84/">America/Denver GMT -7:00</option>
                <option value="/api/private/tutortimezone/85/">America/Detroit GMT -5:00</option>
                <option value="/api/private/tutortimezone/86/">America/Dominica GMT -4:00</option>
                <option value="/api/private/tutortimezone/87/">America/Edmonton GMT -7:00</option>
                <option value="/api/private/tutortimezone/88/">America/Eirunepe GMT -5:00</option>
                <option value="/api/private/tutortimezone/89/">America/El_Salvador GMT -6:00</option>
                <option value="/api/private/tutortimezone/90/">America/Ensenada GMT -8:00</option>
                <option value="/api/private/tutortimezone/92/">America/Fortaleza GMT -3:00</option>
                <option value="/api/private/tutortimezone/511/">America/Fort_Nelson GMT -7:00</option>
                <option value="/api/private/tutortimezone/91/">America/Fort_Wayne GMT -5:00</option>
                <option value="/api/private/tutortimezone/93/">America/Glace_Bay GMT -4:00</option>
                <option value="/api/private/tutortimezone/94/">America/Godthab GMT -3:00</option>
                <option value="/api/private/tutortimezone/95/">America/Goose_Bay GMT -4:00</option>
                <option value="/api/private/tutortimezone/96/">America/Grand_Turk GMT -5:00</option>
                <option value="/api/private/tutortimezone/97/">America/Grenada GMT -4:00</option>
                <option value="/api/private/tutortimezone/98/">America/Guadeloupe GMT -4:00</option>
                <option value="/api/private/tutortimezone/99/">America/Guatemala GMT -6:00</option>
                <option value="/api/private/tutortimezone/100/">America/Guayaquil GMT -5:00</option>
                <option value="/api/private/tutortimezone/101/">America/Guyana GMT -4:00</option>
                <option value="/api/private/tutortimezone/102/">America/Halifax GMT -4:00</option>
                <option value="/api/private/tutortimezone/103/">America/Havana GMT -5:00</option>
                <option value="/api/private/tutortimezone/104/">America/Hermosillo GMT -7:00</option>
                <option value="/api/private/tutortimezone/105/">America/Indiana/Indianapolis GMT -5:00</option>
                <option value="/api/private/tutortimezone/106/">America/Indiana/Knox GMT -6:00</option>
                <option value="/api/private/tutortimezone/107/">America/Indiana/Marengo GMT -5:00</option>
                <option value="/api/private/tutortimezone/108/">America/Indiana/Petersburg GMT -5:00</option>
                <option value="/api/private/tutortimezone/113/">America/Indianapolis GMT -5:00</option>
                <option value="/api/private/tutortimezone/109/">America/Indiana/Tell_City GMT -6:00</option>
                <option value="/api/private/tutortimezone/110/">America/Indiana/Vevay GMT -5:00</option>
                <option value="/api/private/tutortimezone/111/">America/Indiana/Vincennes GMT -5:00</option>
                <option value="/api/private/tutortimezone/112/">America/Indiana/Winamac GMT -5:00</option>
                <option value="/api/private/tutortimezone/114/">America/Inuvik GMT -7:00</option>
                <option value="/api/private/tutortimezone/115/">America/Iqaluit GMT -5:00</option>
                <option value="/api/private/tutortimezone/116/">America/Jamaica GMT -5:00</option>
                <option value="/api/private/tutortimezone/117/">America/Jujuy GMT -3:00</option>
                <option value="/api/private/tutortimezone/118/">America/Juneau GMT -9:00</option>
                <option value="/api/private/tutortimezone/119/">America/Kentucky/Louisville GMT -5:00</option>
                <option value="/api/private/tutortimezone/120/">America/Kentucky/Monticello GMT -5:00</option>
                <option value="/api/private/tutortimezone/121/">America/Knox_IN GMT -6:00</option>
                <option value="/api/private/tutortimezone/122/">America/Kralendijk GMT -4:00</option>
                <option value="/api/private/tutortimezone/123/">America/La_Paz GMT -4:00</option>
                <option value="/api/private/tutortimezone/124/">America/Lima GMT -5:00</option>
                <option value="/api/private/tutortimezone/125/">America/Los_Angeles GMT -8:00</option>
                <option value="/api/private/tutortimezone/126/">America/Louisville GMT -5:00</option>
                <option value="/api/private/tutortimezone/127/">America/Lower_Princes GMT -4:00</option>
                <option value="/api/private/tutortimezone/128/">America/Maceio GMT -3:00</option>
                <option value="/api/private/tutortimezone/129/">America/Managua GMT -6:00</option>
                <option value="/api/private/tutortimezone/130/">America/Manaus GMT -4:00</option>
                <option value="/api/private/tutortimezone/131/">America/Marigot GMT -4:00</option>
                <option value="/api/private/tutortimezone/132/">America/Martinique GMT -4:00</option>
                <option value="/api/private/tutortimezone/133/">America/Matamoros GMT -6:00</option>
                <option value="/api/private/tutortimezone/134/">America/Mazatlan GMT -7:00</option>
                <option value="/api/private/tutortimezone/135/">America/Mendoza GMT -3:00</option>
                <option value="/api/private/tutortimezone/136/">America/Menominee GMT -6:00</option>
                <option value="/api/private/tutortimezone/137/">America/Merida GMT -6:00</option>
                <option value="/api/private/tutortimezone/138/">America/Metlakatla GMT -9:00</option>
                <option value="/api/private/tutortimezone/139/">America/Mexico_City GMT -6:00</option>
                <option value="/api/private/tutortimezone/140/">America/Miquelon GMT -3:00</option>
                <option value="/api/private/tutortimezone/141/">America/Moncton GMT -4:00</option>
                <option value="/api/private/tutortimezone/142/">America/Monterrey GMT -6:00</option>
                <option value="/api/private/tutortimezone/143/">America/Montevideo GMT -3:00</option>
                <option value="/api/private/tutortimezone/144/">America/Montreal GMT -5:00</option>
                <option value="/api/private/tutortimezone/145/">America/Montserrat GMT -4:00</option>
                <option value="/api/private/tutortimezone/146/">America/Nassau GMT -5:00</option>
                <option value="/api/private/tutortimezone/147/">America/New_York GMT -5:00</option>
                <option value="/api/private/tutortimezone/148/">America/Nipigon GMT -5:00</option>
                <option value="/api/private/tutortimezone/149/">America/Nome GMT -9:00</option>
                <option value="/api/private/tutortimezone/150/">America/Noronha GMT -2:00</option>
                <option value="/api/private/tutortimezone/151/">America/North_Dakota/Beulah GMT -6:00</option>
                <option value="/api/private/tutortimezone/152/">America/North_Dakota/Center GMT -6:00</option>
                <option value="/api/private/tutortimezone/153/">America/North_Dakota/New_Salem GMT -6:00</option>
                <option value="/api/private/tutortimezone/154/">America/Ojinaga GMT -7:00</option>
                <option value="/api/private/tutortimezone/155/">America/Panama GMT -5:00</option>
                <option value="/api/private/tutortimezone/156/">America/Pangnirtung GMT -5:00</option>
                <option value="/api/private/tutortimezone/157/">America/Paramaribo GMT -3:00</option>
                <option value="/api/private/tutortimezone/158/">America/Phoenix GMT -7:00</option>
                <option value="/api/private/tutortimezone/159/">America/Port-au-Prince GMT -5:00</option>
                <option value="/api/private/tutortimezone/161/">America/Porto_Acre GMT -5:00</option>
                <option value="/api/private/tutortimezone/160/">America/Port_of_Spain GMT -4:00</option>
                <option value="/api/private/tutortimezone/162/">America/Porto_Velho GMT -4:00</option>
                <option value="/api/private/tutortimezone/163/">America/Puerto_Rico GMT -4:00</option>
                <option value="/api/private/tutortimezone/512/">America/Punta_Arenas GMT -3:00</option>
                <option value="/api/private/tutortimezone/164/">America/Rainy_River GMT -6:00</option>
                <option value="/api/private/tutortimezone/165/">America/Rankin_Inlet GMT -6:00</option>
                <option value="/api/private/tutortimezone/166/">America/Recife GMT -3:00</option>
                <option value="/api/private/tutortimezone/167/">America/Regina GMT -6:00</option>
                <option value="/api/private/tutortimezone/168/">America/Resolute GMT -6:00</option>
                <option value="/api/private/tutortimezone/169/">America/Rio_Branco GMT -5:00</option>
                <option value="/api/private/tutortimezone/170/">America/Rosario GMT -3:00</option>
                <option value="/api/private/tutortimezone/171/">America/Santa_Isabel GMT -8:00</option>
                <option value="/api/private/tutortimezone/172/">America/Santarem GMT -3:00</option>
                <option value="/api/private/tutortimezone/173/">America/Santiago GMT -3:00</option>
                <option value="/api/private/tutortimezone/174/">America/Santo_Domingo GMT -4:00</option>
                <option value="/api/private/tutortimezone/175/">America/Sao_Paulo GMT -3:00</option>
                <option value="/api/private/tutortimezone/176/">America/Scoresbysund GMT -1:00</option>
                <option value="/api/private/tutortimezone/177/">America/Shiprock GMT -7:00</option>
                <option value="/api/private/tutortimezone/178/">America/Sitka GMT -9:00</option>
                <option value="/api/private/tutortimezone/179/">America/St_Barthelemy GMT -4:00</option>
                <option value="/api/private/tutortimezone/180/">America/St_Johns GMT -3:30</option>
                <option value="/api/private/tutortimezone/181/">America/St_Kitts GMT -4:00</option>
                <option value="/api/private/tutortimezone/182/">America/St_Lucia GMT -4:00</option>
                <option value="/api/private/tutortimezone/183/">America/St_Thomas GMT -4:00</option>
                <option value="/api/private/tutortimezone/184/">America/St_Vincent GMT -4:00</option>
                <option value="/api/private/tutortimezone/185/">America/Swift_Current GMT -6:00</option>
                <option value="/api/private/tutortimezone/186/">America/Tegucigalpa GMT -6:00</option>
                <option value="/api/private/tutortimezone/187/">America/Thule GMT -4:00</option>
                <option value="/api/private/tutortimezone/188/">America/Thunder_Bay GMT -5:00</option>
                <option value="/api/private/tutortimezone/189/">America/Tijuana GMT -8:00</option>
                <option value="/api/private/tutortimezone/190/">America/Toronto GMT -5:00</option>
                <option value="/api/private/tutortimezone/191/">America/Tortola GMT -4:00</option>
                <option value="/api/private/tutortimezone/192/">America/Vancouver GMT -8:00</option>
                <option value="/api/private/tutortimezone/193/">America/Virgin GMT -4:00</option>
                <option value="/api/private/tutortimezone/194/">America/Whitehorse GMT -7:00</option>
                <option value="/api/private/tutortimezone/195/">America/Winnipeg GMT -6:00</option>
                <option value="/api/private/tutortimezone/196/">America/Yakutat GMT -9:00</option>
                <option value="/api/private/tutortimezone/197/">America/Yellowknife GMT -7:00</option>
                <option value="/api/private/tutortimezone/434/">Antarctica/Casey GMT +11:00</option>
                <option value="/api/private/tutortimezone/435/">Antarctica/Davis GMT +7:00</option>
                <option value="/api/private/tutortimezone/436/">Antarctica/DumontDUrville GMT +10:00</option>
                <option value="/api/private/tutortimezone/437/">Antarctica/Macquarie GMT +11:00</option>
                <option value="/api/private/tutortimezone/438/">Antarctica/Mawson GMT +5:00</option>
                <option value="/api/private/tutortimezone/439/">Antarctica/McMurdo GMT -11:00</option>
                <option value="/api/private/tutortimezone/440/">Antarctica/Palmer GMT -3:00</option>
                <option value="/api/private/tutortimezone/441/">Antarctica/Rothera GMT -3:00</option>
                <option value="/api/private/tutortimezone/513/">Antarctica/South_Pole GMT -11:00</option>
                <option value="/api/private/tutortimezone/442/">Antarctica/Syowa GMT +3:00</option>
                <option value="/api/private/tutortimezone/443/">Antarctica/Troll GMT +0:00</option>
                <option value="/api/private/tutortimezone/444/">Antarctica/Vostok GMT +6:00</option>
                <option value="/api/private/tutortimezone/445/">Arctic/Longyearbyen GMT +1:00</option>
                <option value="/api/private/tutortimezone/198/">Asia/Aden GMT +3:00</option>
                <option value="/api/private/tutortimezone/9/">Asia/Almaty GMT +6:00</option>
                <option value="/api/private/tutortimezone/199/">Asia/Amman GMT +2:00</option>
                <option value="/api/private/tutortimezone/27/">Asia/Anadyr GMT +12:00</option>
                <option value="/api/private/tutortimezone/31/">Asia/Aqtau GMT +5:00</option>
                <option value="/api/private/tutortimezone/30/">Asia/Aqtobe GMT +5:00</option>
                <option value="/api/private/tutortimezone/200/">Asia/Ashgabat GMT +5:00</option>
                <option value="/api/private/tutortimezone/201/">Asia/Ashkhabad GMT +5:00</option>
                <option value="/api/private/tutortimezone/514/">Asia/Atyrau GMT +5:00</option>
                <option value="/api/private/tutortimezone/202/">Asia/Baghdad GMT +3:00</option>
                <option value="/api/private/tutortimezone/203/">Asia/Bahrain GMT +3:00</option>
                <option value="/api/private/tutortimezone/204/">Asia/Baku GMT +4:00</option>
                <option value="/api/private/tutortimezone/205/">Asia/Bangkok GMT +7:00</option>
                <option value="/api/private/tutortimezone/515/">Asia/Barnaul GMT +7:00</option>
                <option value="/api/private/tutortimezone/206/">Asia/Beirut GMT +2:00</option>
                <option value="/api/private/tutortimezone/207/">Asia/Bishkek GMT +6:00</option>
                <option value="/api/private/tutortimezone/208/">Asia/Brunei GMT +8:00</option>
                <option value="/api/private/tutortimezone/209/">Asia/Calcutta GMT +5:30</option>
                <option value="/api/private/tutortimezone/446/">Asia/Chita GMT +9:00</option>
                <option value="/api/private/tutortimezone/210/">Asia/Choibalsan GMT +8:00</option>
                <option value="/api/private/tutortimezone/211/">Asia/Chongqing GMT +8:00</option>
                <option value="/api/private/tutortimezone/212/">Asia/Chungking GMT +8:00</option>
                <option value="/api/private/tutortimezone/213/">Asia/Colombo GMT +5:30</option>
                <option value="/api/private/tutortimezone/214/">Asia/Dacca GMT +6:00</option>
                <option value="/api/private/tutortimezone/215/">Asia/Damascus GMT +2:00</option>
                <option value="/api/private/tutortimezone/216/">Asia/Dhaka GMT +6:00</option>
                <option value="/api/private/tutortimezone/217/">Asia/Dili GMT +9:00</option>
                <option value="/api/private/tutortimezone/218/">Asia/Dubai GMT +4:00</option>
                <option value="/api/private/tutortimezone/219/">Asia/Dushanbe GMT +5:00</option>
                <option value="/api/private/tutortimezone/516/">Asia/Famagusta GMT +2:00</option>
                <option value="/api/private/tutortimezone/220/">Asia/Gaza GMT +2:00</option>
                <option value="/api/private/tutortimezone/221/">Asia/Harbin GMT +8:00</option>
                <option value="/api/private/tutortimezone/222/">Asia/Hebron GMT +2:00</option>
                <option value="/api/private/tutortimezone/223/">Asia/Ho_Chi_Minh GMT +7:00</option>
                <option value="/api/private/tutortimezone/224/">Asia/Hong_Kong GMT +8:00</option>
                <option value="/api/private/tutortimezone/225/">Asia/Hovd GMT +7:00</option>
                <option value="/api/private/tutortimezone/19/">Asia/Irkutsk GMT +8:00</option>
                <option value="/api/private/tutortimezone/226/">Asia/Istanbul GMT +3:00</option>
                <option value="/api/private/tutortimezone/227/">Asia/Jakarta GMT +7:00</option>
                <option value="/api/private/tutortimezone/228/">Asia/Jayapura GMT +9:00</option>
                <option value="/api/private/tutortimezone/229/">Asia/Jerusalem GMT +2:00</option>
                <option value="/api/private/tutortimezone/230/">Asia/Kabul GMT +4:30</option>
                <option value="/api/private/tutortimezone/26/">Asia/Kamchatka GMT +12:00</option>
                <option value="/api/private/tutortimezone/231/">Asia/Karachi GMT +5:00</option>
                <option value="/api/private/tutortimezone/232/">Asia/Kashgar GMT +6:00</option>
                <option value="/api/private/tutortimezone/233/">Asia/Kathmandu GMT +5:45</option>
                <option value="/api/private/tutortimezone/234/">Asia/Katmandu GMT +5:45</option>
                <option value="/api/private/tutortimezone/447/">Asia/Khandyga GMT +9:00</option>
                <option value="/api/private/tutortimezone/236/">Asia/Kolkata GMT +5:30</option>
                <option value="/api/private/tutortimezone/18/">Asia/Krasnoyarsk GMT +7:00</option>
                <option value="/api/private/tutortimezone/237/">Asia/Kuala_Lumpur GMT +8:00</option>
                <option value="/api/private/tutortimezone/238/">Asia/Kuching GMT +8:00</option>
                <option value="/api/private/tutortimezone/239/">Asia/Kuwait GMT +3:00</option>
                <option value="/api/private/tutortimezone/240/">Asia/Macao GMT +8:00</option>
                <option value="/api/private/tutortimezone/241/">Asia/Macau GMT +8:00</option>
                <option value="/api/private/tutortimezone/25/">Asia/Magadan GMT +11:00</option>
                <option value="/api/private/tutortimezone/242/">Asia/Makassar GMT +8:00</option>
                <option value="/api/private/tutortimezone/243/">Asia/Manila GMT +8:00</option>
                <option value="/api/private/tutortimezone/244/">Asia/Muscat GMT +4:00</option>
                <option value="/api/private/tutortimezone/245/">Asia/Nicosia GMT +2:00</option>
                <option value="/api/private/tutortimezone/17/">Asia/Novokuznetsk GMT +7:00</option>
                <option value="/api/private/tutortimezone/16/">Asia/Novosibirsk GMT +7:00</option>
                <option value="/api/private/tutortimezone/15/">Asia/Omsk GMT +6:00</option>
                <option value="/api/private/tutortimezone/32/">Asia/Oral GMT +5:00</option>
                <option value="/api/private/tutortimezone/246/">Asia/Phnom_Penh GMT +7:00</option>
                <option value="/api/private/tutortimezone/247/">Asia/Pontianak GMT +7:00</option>
                <option value="/api/private/tutortimezone/248/">Asia/Pyongyang GMT +9:00</option>
                <option value="/api/private/tutortimezone/249/">Asia/Qatar GMT +3:00</option>
                <option value="/api/private/tutortimezone/29/">Asia/Qyzylorda GMT +5:00</option>
                <option value="/api/private/tutortimezone/250/">Asia/Rangoon GMT +6:30</option>
                <option value="/api/private/tutortimezone/251/">Asia/Riyadh GMT +3:00</option>
                <option value="/api/private/tutortimezone/252/">Asia/Saigon GMT +7:00</option>
                <option value="/api/private/tutortimezone/23/">Asia/Sakhalin GMT +11:00</option>
                <option value="/api/private/tutortimezone/253/">Asia/Samarkand GMT +5:00</option>
                <option value="/api/private/tutortimezone/254/">Asia/Seoul GMT +9:00</option>
                <option value="/api/private/tutortimezone/255/">Asia/Shanghai GMT +8:00</option>
                <option value="/api/private/tutortimezone/256/">Asia/Singapore GMT +8:00</option>
                <option value="/api/private/tutortimezone/448/">Asia/Srednekolymsk GMT +11:00</option>
                <option value="/api/private/tutortimezone/257/">Asia/Taipei GMT +8:00</option>
                <option value="/api/private/tutortimezone/258/">Asia/Tashkent GMT +5:00</option>
                <option value="/api/private/tutortimezone/259/">Asia/Tbilisi GMT +4:00</option>
                <option value="/api/private/tutortimezone/260/">Asia/Tehran GMT +3:30</option>
                <option value="/api/private/tutortimezone/261/">Asia/Tel_Aviv GMT +2:00</option>
                <option value="/api/private/tutortimezone/262/">Asia/Thimbu GMT +6:00</option>
                <option value="/api/private/tutortimezone/263/">Asia/Thimphu GMT +6:00</option>
                <option value="/api/private/tutortimezone/264/">Asia/Tokyo GMT +9:00</option>
                <option value="/api/private/tutortimezone/517/">Asia/Tomsk GMT +7:00</option>
                <option value="/api/private/tutortimezone/265/">Asia/Ujung_Pandang GMT +8:00</option>
                <option value="/api/private/tutortimezone/266/">Asia/Ulaanbaatar GMT +8:00</option>
                <option value="/api/private/tutortimezone/267/">Asia/Ulan_Bator GMT +8:00</option>
                <option value="/api/private/tutortimezone/268/">Asia/Urumqi GMT +6:00</option>
                <option value="/api/private/tutortimezone/449/">Asia/Ust-Nera GMT +10:00</option>
                <option value="/api/private/tutortimezone/270/">Asia/Vientiane GMT +7:00</option>
                <option value="/api/private/tutortimezone/22/">Asia/Vladivostok GMT +10:00</option>
                <option value="/api/private/tutortimezone/20/">Asia/Yakutsk GMT +9:00</option>
                <option value="/api/private/tutortimezone/518/">Asia/Yangon GMT +6:30</option>
                <option value="/api/private/tutortimezone/14/">Asia/Yekaterinburg GMT +5:00</option>
                <option value="/api/private/tutortimezone/271/">Asia/Yerevan GMT +4:00</option>
                <option value="/api/private/tutortimezone/450/">Atlantic/Azores GMT -1:00</option>
                <option value="/api/private/tutortimezone/451/">Atlantic/Bermuda GMT -4:00</option>
                <option value="/api/private/tutortimezone/452/">Atlantic/Canary GMT +0:00</option>
                <option value="/api/private/tutortimezone/453/">Atlantic/Cape_Verde GMT -1:00</option>
                <option value="/api/private/tutortimezone/519/">Atlantic/Faeroe GMT +0:00</option>
                <option value="/api/private/tutortimezone/454/">Atlantic/Faroe GMT +0:00</option>
                <option value="/api/private/tutortimezone/520/">Atlantic/Jan_Mayen GMT +1:00</option>
                <option value="/api/private/tutortimezone/455/">Atlantic/Madeira GMT +0:00</option>
                <option value="/api/private/tutortimezone/456/">Atlantic/Reykjavik GMT +0:00</option>
                <option value="/api/private/tutortimezone/457/">Atlantic/South_Georgia GMT -2:00</option>
                <option value="/api/private/tutortimezone/459/">Atlantic/Stanley GMT -3:00</option>
                <option value="/api/private/tutortimezone/458/">Atlantic/St_Helena GMT +0:00</option>
                <option value="/api/private/tutortimezone/272/">Australia/ACT GMT +11:00</option>
                <option value="/api/private/tutortimezone/273/">Australia/Adelaide GMT +10:30</option>
                <option value="/api/private/tutortimezone/274/">Australia/Brisbane GMT +10:00</option>
                <option value="/api/private/tutortimezone/275/">Australia/Broken_Hill GMT +10:30</option>
                <option value="/api/private/tutortimezone/276/">Australia/Canberra GMT +11:00</option>
                <option value="/api/private/tutortimezone/277/">Australia/Currie GMT +11:00</option>
                <option value="/api/private/tutortimezone/278/">Australia/Darwin GMT +9:30</option>
                <option value="/api/private/tutortimezone/279/">Australia/Eucla GMT +8:45</option>
                <option value="/api/private/tutortimezone/280/">Australia/Hobart GMT +11:00</option>
                <option value="/api/private/tutortimezone/281/">Australia/LHI GMT +11:00</option>
                <option value="/api/private/tutortimezone/282/">Australia/Lindeman GMT +10:00</option>
                <option value="/api/private/tutortimezone/283/">Australia/Lord_Howe GMT +11:00</option>
                <option value="/api/private/tutortimezone/284/">Australia/Melbourne GMT +11:00</option>
                <option value="/api/private/tutortimezone/286/">Australia/North GMT +9:30</option>
                <option value="/api/private/tutortimezone/285/">Australia/NSW GMT +11:00</option>
                <option value="/api/private/tutortimezone/287/">Australia/Perth GMT +8:00</option>
                <option value="/api/private/tutortimezone/288/">Australia/Queensland GMT +10:00</option>
                <option value="/api/private/tutortimezone/289/">Australia/South GMT +10:30</option>
                <option value="/api/private/tutortimezone/290/">Australia/Sydney GMT +11:00</option>
                <option value="/api/private/tutortimezone/291/">Australia/Tasmania GMT +11:00</option>
                <option value="/api/private/tutortimezone/292/">Australia/Victoria GMT +11:00</option>
                <option value="/api/private/tutortimezone/293/">Australia/West GMT +8:00</option>
                <option value="/api/private/tutortimezone/294/">Australia/Yancowinna GMT +10:30</option>
                <option value="/api/private/tutortimezone/295/">Brazil/Acre GMT -5:00</option>
                <option value="/api/private/tutortimezone/296/">Brazil/DeNoronha GMT -2:00</option>
                <option value="/api/private/tutortimezone/297/">Brazil/East GMT -3:00</option>
                <option value="/api/private/tutortimezone/298/">Brazil/West GMT -4:00</option>
                <option value="/api/private/tutortimezone/299/">Canada/Atlantic GMT -4:00</option>
                <option value="/api/private/tutortimezone/300/">Canada/Central GMT -6:00</option>
                <option value="/api/private/tutortimezone/302/">Canada/Eastern GMT -5:00</option>
                <option value="/api/private/tutortimezone/303/">Canada/Mountain GMT -7:00</option>
                <option value="/api/private/tutortimezone/304/">Canada/Newfoundland GMT -3:30</option>
                <option value="/api/private/tutortimezone/305/">Canada/Pacific GMT -8:00</option>
                <option value="/api/private/tutortimezone/306/">Canada/Saskatchewan GMT -6:00</option>
                <option value="/api/private/tutortimezone/307/">Canada/Yukon GMT -7:00</option>
                <option value="/api/private/tutortimezone/521/">CET GMT +1:00</option>
                <option value="/api/private/tutortimezone/308/">Chile/Continental GMT -3:00</option>
                <option value="/api/private/tutortimezone/309/">Chile/EasterIsland GMT -5:00</option>
                <option value="/api/private/tutortimezone/522/">CST6CDT GMT -6:00</option>
                <option value="/api/private/tutortimezone/523/">Cuba GMT -5:00</option>
                <option value="/api/private/tutortimezone/310/">EET GMT +2:00</option>
                <option value="/api/private/tutortimezone/525/">Egypt GMT +2:00</option>
                <option value="/api/private/tutortimezone/526/">Eire GMT +0:00</option>
                <option value="/api/private/tutortimezone/311/">EST GMT -5:00</option>
                <option value="/api/private/tutortimezone/524/">EST5EDT GMT -5:00</option>
                <option value="/api/private/tutortimezone/527/">Etc/GMT GMT +0:00</option>
                <option value="/api/private/tutortimezone/556/">Etc/GMT0 GMT +0:00</option>
                <option value="/api/private/tutortimezone/541/">Etc/GMT-0 GMT +0:00</option>
                <option value="/api/private/tutortimezone/528/">Etc/GMT+0 GMT +0:00</option>
                <option value="/api/private/tutortimezone/542/">Etc/GMT-1 GMT +1:00</option>
                <option value="/api/private/tutortimezone/529/">Etc/GMT+1 GMT -1:00</option>
                <option value="/api/private/tutortimezone/543/">Etc/GMT-10 GMT +10:00</option>
                <option value="/api/private/tutortimezone/530/">Etc/GMT+10 GMT -10:00</option>
                <option value="/api/private/tutortimezone/544/">Etc/GMT-11 GMT +11:00</option>
                <option value="/api/private/tutortimezone/531/">Etc/GMT+11 GMT -11:00</option>
                <option value="/api/private/tutortimezone/545/">Etc/GMT-12 GMT +12:00</option>
                <option value="/api/private/tutortimezone/532/">Etc/GMT+12 GMT +12:00</option>
                <option value="/api/private/tutortimezone/546/">Etc/GMT-13 GMT -11:00</option>
                <option value="/api/private/tutortimezone/547/">Etc/GMT-14 GMT -10:00</option>
                <option value="/api/private/tutortimezone/548/">Etc/GMT-2 GMT +2:00</option>
                <option value="/api/private/tutortimezone/533/">Etc/GMT+2 GMT -2:00</option>
                <option value="/api/private/tutortimezone/549/">Etc/GMT-3 GMT +3:00</option>
                <option value="/api/private/tutortimezone/534/">Etc/GMT+3 GMT -3:00</option>
                <option value="/api/private/tutortimezone/550/">Etc/GMT-4 GMT +4:00</option>
                <option value="/api/private/tutortimezone/535/">Etc/GMT+4 GMT -4:00</option>
                <option value="/api/private/tutortimezone/551/">Etc/GMT-5 GMT +5:00</option>
                <option value="/api/private/tutortimezone/536/">Etc/GMT+5 GMT -5:00</option>
                <option value="/api/private/tutortimezone/552/">Etc/GMT-6 GMT +6:00</option>
                <option value="/api/private/tutortimezone/537/">Etc/GMT+6 GMT -6:00</option>
                <option value="/api/private/tutortimezone/553/">Etc/GMT-7 GMT +7:00</option>
                <option value="/api/private/tutortimezone/538/">Etc/GMT+7 GMT -7:00</option>
                <option value="/api/private/tutortimezone/554/">Etc/GMT-8 GMT +8:00</option>
                <option value="/api/private/tutortimezone/539/">Etc/GMT+8 GMT -8:00</option>
                <option value="/api/private/tutortimezone/555/">Etc/GMT-9 GMT +9:00</option>
                <option value="/api/private/tutortimezone/540/">Etc/GMT+9 GMT -9:00</option>
                <option value="/api/private/tutortimezone/312/">Etc/Greenwich GMT +0:00</option>
                <option value="/api/private/tutortimezone/313/">Etc/UCT GMT +0:00</option>
                <option value="/api/private/tutortimezone/315/">Etc/Universal GMT +0:00</option>
                <option value="/api/private/tutortimezone/314/">Etc/UTC GMT +0:00</option>
                <option value="/api/private/tutortimezone/557/">Etc/Zulu GMT +0:00</option>
                <option value="/api/private/tutortimezone/316/">Europe/Amsterdam GMT +1:00</option>
                <option value="/api/private/tutortimezone/317/">Europe/Andorra GMT +1:00</option>
                <option value="/api/private/tutortimezone/558/">Europe/Astrakhan GMT +4:00</option>
                <option value="/api/private/tutortimezone/318/">Europe/Athens GMT +2:00</option>
                <option value="/api/private/tutortimezone/319/">Europe/Belfast GMT +0:00</option>
                <option value="/api/private/tutortimezone/320/">Europe/Belgrade GMT +1:00</option>
                <option value="/api/private/tutortimezone/321/">Europe/Berlin GMT +1:00</option>
                <option value="/api/private/tutortimezone/322/">Europe/Bratislava GMT +1:00</option>
                <option value="/api/private/tutortimezone/323/">Europe/Brussels GMT +1:00</option>
                <option value="/api/private/tutortimezone/324/">Europe/Bucharest GMT +2:00</option>
                <option value="/api/private/tutortimezone/325/">Europe/Budapest GMT +1:00</option>
                <option value="/api/private/tutortimezone/460/">Europe/Busingen GMT +1:00</option>
                <option value="/api/private/tutortimezone/327/">Europe/Chisinau GMT +2:00</option>
                <option value="/api/private/tutortimezone/328/">Europe/Copenhagen GMT +1:00</option>
                <option value="/api/private/tutortimezone/329/">Europe/Dublin GMT +0:00</option>
                <option value="/api/private/tutortimezone/330/">Europe/Gibraltar GMT +1:00</option>
                <option value="/api/private/tutortimezone/331/">Europe/Guernsey GMT +0:00</option>
                <option value="/api/private/tutortimezone/332/">Europe/Helsinki GMT +2:00</option>
                <option value="/api/private/tutortimezone/333/">Europe/Isle_of_Man GMT +0:00</option>
                <option value="/api/private/tutortimezone/334/">Europe/Istanbul GMT +3:00</option>
                <option value="/api/private/tutortimezone/335/">Europe/Jersey GMT +0:00</option>
                <option value="/api/private/tutortimezone/11/">Europe/Kaliningrad GMT +2:00</option>
                <option value="/api/private/tutortimezone/7/">Europe/Kiev GMT +2:00</option>
                <option value="/api/private/tutortimezone/559/">Europe/Kirov GMT +3:00</option>
                <option value="/api/private/tutortimezone/336/">Europe/Lisbon GMT +0:00</option>
                <option value="/api/private/tutortimezone/337/">Europe/Ljubljana GMT +1:00</option>
                <option value="/api/private/tutortimezone/33/">Europe/London GMT +0:00</option>
                <option value="/api/private/tutortimezone/338/">Europe/Luxembourg GMT +1:00</option>
                <option value="/api/private/tutortimezone/339/">Europe/Madrid GMT +1:00</option>
                <option value="/api/private/tutortimezone/340/">Europe/Malta GMT +1:00</option>
                <option value="/api/private/tutortimezone/341/">Europe/Mariehamn GMT +2:00</option>
                <option value="/api/private/tutortimezone/342/">Europe/Minsk GMT +3:00</option>
                <option value="/api/private/tutortimezone/343/">Europe/Monaco GMT +1:00</option>
                <option value="/api/private/tutortimezone/8/">Europe/Moscow GMT +3:00</option>
                <option value="/api/private/tutortimezone/344/">Europe/Nicosia GMT +2:00</option>
                <option value="/api/private/tutortimezone/345/">Europe/Oslo GMT +1:00</option>
                <option value="/api/private/tutortimezone/346/">Europe/Paris GMT +1:00</option>
                <option value="/api/private/tutortimezone/347/">Europe/Podgorica GMT +1:00</option>
                <option value="/api/private/tutortimezone/348/">Europe/Prague GMT +1:00</option>
                <option value="/api/private/tutortimezone/349/">Europe/Riga GMT +2:00</option>
                <option value="/api/private/tutortimezone/350/">Europe/Rome GMT +1:00</option>
                <option value="/api/private/tutortimezone/13/">Europe/Samara GMT +4:00</option>
                <option value="/api/private/tutortimezone/351/">Europe/San_Marino GMT +1:00</option>
                <option value="/api/private/tutortimezone/352/">Europe/Sarajevo GMT +1:00</option>
                <option value="/api/private/tutortimezone/560/">Europe/Saratov GMT +4:00</option>
                <option value="/api/private/tutortimezone/353/">Europe/Simferopol GMT +3:00</option>
                <option value="/api/private/tutortimezone/354/">Europe/Skopje GMT +1:00</option>
                <option value="/api/private/tutortimezone/355/">Europe/Sofia GMT +2:00</option>
                <option value="/api/private/tutortimezone/356/">Europe/Stockholm GMT +1:00</option>
                <option value="/api/private/tutortimezone/357/">Europe/Tallinn GMT +2:00</option>
                <option value="/api/private/tutortimezone/358/">Europe/Tirane GMT +1:00</option>
                <option value="/api/private/tutortimezone/359/">Europe/Tiraspol GMT +2:00</option>
                <option value="/api/private/tutortimezone/561/">Europe/Ulyanovsk GMT +4:00</option>
                <option value="/api/private/tutortimezone/360/">Europe/Uzhgorod GMT +2:00</option>
                <option value="/api/private/tutortimezone/361/">Europe/Vaduz GMT +1:00</option>
                <option value="/api/private/tutortimezone/362/">Europe/Vatican GMT +1:00</option>
                <option value="/api/private/tutortimezone/363/">Europe/Vienna GMT +1:00</option>
                <option value="/api/private/tutortimezone/364/">Europe/Vilnius GMT +2:00</option>
                <option value="/api/private/tutortimezone/12/">Europe/Volgograd GMT +3:00</option>
                <option value="/api/private/tutortimezone/10/">Europe/Warsaw GMT +1:00</option>
                <option value="/api/private/tutortimezone/365/">Europe/Zagreb GMT +1:00</option>
                <option value="/api/private/tutortimezone/366/">Europe/Zaporozhye GMT +2:00</option>
                <option value="/api/private/tutortimezone/367/">Europe/Zurich GMT +1:00</option>
                <option value="/api/private/tutortimezone/562/">GB GMT +0:00</option>
                <option value="/api/private/tutortimezone/563/">GB-Eire GMT +0:00</option>
                <option value="/api/private/tutortimezone/461/">GMT GMT +0:00</option>
                <option value="/api/private/tutortimezone/566/">GMT0 GMT +0:00</option>
                <option value="/api/private/tutortimezone/565/">GMT-0 GMT +0:00</option>
                <option value="/api/private/tutortimezone/564/">GMT+0 GMT +0:00</option>
                <option value="/api/private/tutortimezone/567/">Greenwich GMT +0:00</option>
                <option value="/api/private/tutortimezone/569/">Hongkong GMT +8:00</option>
                <option value="/api/private/tutortimezone/568/">HST GMT -10:00</option>
                <option value="/api/private/tutortimezone/570/">Iceland GMT +0:00</option>
                <option value="/api/private/tutortimezone/462/">Indian/Antananarivo GMT +3:00</option>
                <option value="/api/private/tutortimezone/463/">Indian/Chagos GMT +6:00</option>
                <option value="/api/private/tutortimezone/464/">Indian/Christmas GMT +7:00</option>
                <option value="/api/private/tutortimezone/465/">Indian/Cocos GMT +6:30</option>
                <option value="/api/private/tutortimezone/466/">Indian/Comoro GMT +3:00</option>
                <option value="/api/private/tutortimezone/467/">Indian/Kerguelen GMT +5:00</option>
                <option value="/api/private/tutortimezone/468/">Indian/Mahe GMT +4:00</option>
                <option value="/api/private/tutortimezone/469/">Indian/Maldives GMT +5:00</option>
                <option value="/api/private/tutortimezone/470/">Indian/Mauritius GMT +4:00</option>
                <option value="/api/private/tutortimezone/471/">Indian/Mayotte GMT +3:00</option>
                <option value="/api/private/tutortimezone/472/">Indian/Reunion GMT +4:00</option>
                <option value="/api/private/tutortimezone/571/">Iran GMT +3:30</option>
                <option value="/api/private/tutortimezone/572/">Israel GMT +2:00</option>
                <option value="/api/private/tutortimezone/573/">Jamaica GMT -5:00</option>
                <option value="/api/private/tutortimezone/574/">Japan GMT +9:00</option>
                <option value="/api/private/tutortimezone/575/">Kwajalein GMT +12:00</option>
                <option value="/api/private/tutortimezone/576/">Libya GMT +2:00</option>
                <option value="/api/private/tutortimezone/577/">MET GMT +1:00</option>
                <option value="/api/private/tutortimezone/368/">Mexico/BajaNorte GMT -8:00</option>
                <option value="/api/private/tutortimezone/369/">Mexico/BajaSur GMT -7:00</option>
                <option value="/api/private/tutortimezone/370/">Mexico/General GMT -6:00</option>
                <option value="/api/private/tutortimezone/578/">MST GMT -7:00</option>
                <option value="/api/private/tutortimezone/579/">MST7MDT GMT -7:00</option>
                <option value="/api/private/tutortimezone/582/">Navajo GMT -7:00</option>
                <option value="/api/private/tutortimezone/580/">NZ GMT -11:00</option>
                <option value="/api/private/tutortimezone/581/">NZ-CHAT GMT -10:45</option>
                <option value="/api/private/tutortimezone/473/">Pacific/Apia GMT -11:00</option>
                <option value="/api/private/tutortimezone/380/">Pacific/Auckland GMT -11:00</option>
                <option value="/api/private/tutortimezone/474/">Pacific/Bougainville GMT +11:00</option>
                <option value="/api/private/tutortimezone/475/">Pacific/Chatham GMT -10:45</option>
                <option value="/api/private/tutortimezone/476/">Pacific/Chuuk GMT +10:00</option>
                <option value="/api/private/tutortimezone/477/">Pacific/Easter GMT -5:00</option>
                <option value="/api/private/tutortimezone/478/">Pacific/Efate GMT +11:00</option>
                <option value="/api/private/tutortimezone/479/">Pacific/Enderbury GMT -11:00</option>
                <option value="/api/private/tutortimezone/480/">Pacific/Fakaofo GMT -11:00</option>
                <option value="/api/private/tutortimezone/481/">Pacific/Fiji GMT -11:00</option>
                <option value="/api/private/tutortimezone/482/">Pacific/Funafuti GMT +12:00</option>
                <option value="/api/private/tutortimezone/483/">Pacific/Galapagos GMT -6:00</option>
                <option value="/api/private/tutortimezone/484/">Pacific/Gambier GMT -9:00</option>
                <option value="/api/private/tutortimezone/485/">Pacific/Guadalcanal GMT +11:00</option>
                <option value="/api/private/tutortimezone/486/">Pacific/Guam GMT +10:00</option>
                <option value="/api/private/tutortimezone/381/">Pacific/Honolulu GMT -10:00</option>
                <option value="/api/private/tutortimezone/487/">Pacific/Johnston GMT -10:00</option>
                <option value="/api/private/tutortimezone/488/">Pacific/Kiritimati GMT -10:00</option>
                <option value="/api/private/tutortimezone/489/">Pacific/Kosrae GMT +11:00</option>
                <option value="/api/private/tutortimezone/490/">Pacific/Kwajalein GMT +12:00</option>
                <option value="/api/private/tutortimezone/491/">Pacific/Majuro GMT +12:00</option>
                <option value="/api/private/tutortimezone/492/">Pacific/Marquesas GMT -9:30</option>
                <option value="/api/private/tutortimezone/493/">Pacific/Midway GMT -11:00</option>
                <option value="/api/private/tutortimezone/494/">Pacific/Nauru GMT +12:00</option>
                <option value="/api/private/tutortimezone/495/">Pacific/Niue GMT -11:00</option>
                <option value="/api/private/tutortimezone/496/">Pacific/Norfolk GMT +12:00</option>
                <option value="/api/private/tutortimezone/497/">Pacific/Noumea GMT +11:00</option>
                <option value="/api/private/tutortimezone/498/">Pacific/Pago_Pago GMT -11:00</option>
                <option value="/api/private/tutortimezone/499/">Pacific/Palau GMT +9:00</option>
                <option value="/api/private/tutortimezone/500/">Pacific/Pitcairn GMT -8:00</option>
                <option value="/api/private/tutortimezone/501/">Pacific/Pohnpei GMT +11:00</option>
                <option value="/api/private/tutortimezone/585/">Pacific/Ponape GMT +11:00</option>
                <option value="/api/private/tutortimezone/502/">Pacific/Port_Moresby GMT +10:00</option>
                <option value="/api/private/tutortimezone/503/">Pacific/Rarotonga GMT -10:00</option>
                <option value="/api/private/tutortimezone/379/">Pacific/Saipan GMT +10:00</option>
                <option value="/api/private/tutortimezone/586/">Pacific/Samoa GMT -11:00</option>
                <option value="/api/private/tutortimezone/504/">Pacific/Tahiti GMT -10:00</option>
                <option value="/api/private/tutortimezone/505/">Pacific/Tarawa GMT +12:00</option>
                <option value="/api/private/tutortimezone/506/">Pacific/Tongatapu GMT -11:00</option>
                <option value="/api/private/tutortimezone/587/">Pacific/Truk GMT +10:00</option>
                <option value="/api/private/tutortimezone/507/">Pacific/Wake GMT +12:00</option>
                <option value="/api/private/tutortimezone/508/">Pacific/Wallis GMT +12:00</option>
                <option value="/api/private/tutortimezone/588/">Pacific/Yap GMT +10:00</option>
                <option value="/api/private/tutortimezone/589/">Poland GMT +1:00</option>
                <option value="/api/private/tutortimezone/590/">Portugal GMT +0:00</option>
                <option value="/api/private/tutortimezone/583/">PRC GMT +8:00</option>
                <option value="/api/private/tutortimezone/584/">PST8PDT GMT -8:00</option>
                <option value="/api/private/tutortimezone/591/">ROC GMT +8:00</option>
                <option value="/api/private/tutortimezone/592/">ROK GMT +9:00</option>
                <option value="/api/private/tutortimezone/593/">Singapore GMT +8:00</option>
                <option value="/api/private/tutortimezone/594/">Turkey GMT +3:00</option>
                <option value="/api/private/tutortimezone/595/">UCT GMT +0:00</option>
                <option value="/api/private/tutortimezone/596/">Universal GMT +0:00</option>
                <option value="/api/private/tutortimezone/2/">US/Alaska GMT -9:00</option>
                <option value="/api/private/tutortimezone/371/">US/Aleutian GMT -10:00</option>
                <option value="/api/private/tutortimezone/372/">US/Arizona GMT -7:00</option>
                <option value="/api/private/tutortimezone/5/">US/Central GMT -6:00</option>
                <option value="/api/private/tutortimezone/6/">US/Eastern GMT -5:00</option>
                <option value="/api/private/tutortimezone/373/">US/East-Indiana GMT -5:00</option>
                <option value="/api/private/tutortimezone/374/">US/Hawaii GMT -10:00</option>
                <option value="/api/private/tutortimezone/375/">US/Indiana-Starke GMT -6:00</option>
                <option value="/api/private/tutortimezone/376/">US/Michigan GMT -5:00</option>
                <option value="/api/private/tutortimezone/3/">US/Mountain GMT -7:00</option>
                <option value="/api/private/tutortimezone/4/">US/Pacific GMT -8:00</option>
                <option value="/api/private/tutortimezone/378/">US/Samoa GMT -11:00</option>
                <option value="/api/private/tutortimezone/1/">UTC GMT +0:00</option>
                <option value="/api/private/tutortimezone/598/">WET GMT +0:00</option>
                <option value="/api/private/tutortimezone/597/">W-SU GMT +3:00</option>
                <option value="/api/private/tutortimezone/599/">Zulu GMT +0:00</option></select>
            </select>
        </div>
        <div class='account-btm-div5'>
            <svg style="width: 21px;height:21px;" aria-hidden="true">
                <use xlink:href="#icon-dengluguge"></use>
            </svg>
            <span class='account-google'>链接谷歌日历，同步CLO的汉语课程安排</span>
        </div>
    `
    let btn = document.createElement('div')
    btn.className = 'account-btn'
    btn.innerHTML = `
        <div class='account-save-btn'>保存设置</div> 
        <div class='account-del-btn'>删除账号</div>
    `
    //
    div.appendChild(top)
    div.appendChild(bottom)
    div.appendChild(btn)
    return div
}

let createPhoneList = () => {
    let fragment = document.createDocumentFragment()
    country.forEach(item => {
        let list = document.createElement('div')
        list.className = 'account-btm-div4-tel-list'
        list.innerHTML = `
            <div class='account-btm-div4-tel-list-country ${item.code}'></div>
            <div class='account-btm-div4-tel-list-country-name'>${item.name}</div>
            <div class='account-btm-div4-tel-list-country-phone'>${item.phone}</div>
        `
        fragment.appendChild(list)
    })
    $('.account-btm-div4-tel-list-wrap')[0].appendChild(fragment)
}

let createUserPwd = () => {
    let div = document.createElement('div')
    div.className = 'setting-pwd'
    let top = document.createElement('div')
    top.className = 'account-top'
    top.innerHTML = '变更密码'

    let bottom = document.createElement('div')
    bottom.className = 'pwd-bottom'
    bottom.innerHTML = `
        <div class='pwd-bottom-list'>
            <span>现在的密码</span>
            <div class='pwd-list-right'>
                <input class='pwd-list-right-input' type='password' />
                <span><a href='/views/forget/forgetpassword.html'>忘记你的密码了?</a></span>
            </div>
        </div>
        <div class='pwd-bottom-list pwd-bottom-list2' style='margin-top:18px'>
            <span>新的密码</span>
            <div class='pwd-list-right'>
                <input class='pwd-list-right-input' type='password'/>
            </div>
        </div>
        <div class='pwd-bottom-list pwd-bottom-list2' style='margin-top:26px' >
            <span>验证密码</span>
            <div class='pwd-list-right'>
                <input class='pwd-list-right-input' type='password'/>
            </div>
        </div>
        <div class='pwd-save'>保存设置</div>
    `
    div.appendChild(top)
    div.appendChild(bottom)
    return div
}

let createPayType = () => {
    let div = document.createElement('div')
    div.className = 'setting-pwd'
    let top = document.createElement('div')
    top.className = 'account-top'
    top.innerHTML = '付款方式'
    let bottom = document.createElement('div')
    bottom.style.cssText = 'border-bottom:2px solid #F6F6F6;padding-bottom:15px'
    bottom.innerHTML = `
        <div class='pl-43 pt-14'>储存付款卡</div>
        <div class='pl-43 pt-12'>快速简便付款。保存信用卡并自动续课，为您保证每周都能上课。</div>
        <div class='pl-43 pt-12'>付款信息由Stripe加密并安全储存.</div>
        <div class='pay-card'>
            <svg style="width: 38px;height:24px;padding-left:43px" aria-hidden="true">
                <use xlink:href="#icon-visa"></use>
            </svg>
            <svg style="width: 40px;height:24px;padding-left:13px" aria-hidden="true">
                <use xlink:href="#icon-mastercard"></use>
            </svg>
            <svg style="width: 40px;height:24px;padding-left:13px" aria-hidden="true">
                <use xlink:href="#icon-amex"></use>
            </svg>
            <svg style="width: 40px;height:24px;padding-left:13px" aria-hidden="true">
                <use xlink:href="#icon-jcb1"></use>
            </svg>
            <svg style="width: 40px;height:24px;padding-left:13px" aria-hidden="true">
                <use xlink:href="#icon-discover1"></use>
            </svg>
            <div class='save-card'>储存卡片</div>
        </div>
    `
    let autoRenew = document.createElement('div')
    autoRenew.innerHTML = `
        <div style='font-weight: bold;padding-left: 42px;font-size: 20px;margin-top:20px;padding-bottom:20px;border-bottom:2px solid #F6F6F6'>自动续课</div>
    `
    let autoDiv = document.createElement('div')
    autoDiv.innerHTML = `
        <div style='width:50%;padding-left:42px;padding-top:20px;font-size:16px;color:#A5A5A5'>余额不足的时候自动购买课时包。选择追加的课时，CLO将从您的信用卡中扣除。（您可以随时转移课程或要求退款）</div>
    `
    let teacherSpend = document.createElement('div')
    teacherSpend.style.cssText = 'width: 50%;'
    teacherSpend.innerHTML = `
        <div class='pay-teacher'>
            <div>老师</div>
            <div>续课</div>
        </div>
        <div class='pay-teacher-list'>
            <div class='pay-teacher-list-left'>
                <img width='30' height='30' src='../../../static/anquan.png' />
                <span>陈老师</span>
            </div>
            <select>
                <option>15</option>
                <option>关闭</option>
            </select>
        </div>
        <div class='pay-teacher-list'>
            <div class='pay-teacher-list-left'>
                <img width='30' height='30' src='../../../static/anquan.png' />
                <span>陈老师</span>
            </div>
            <select>
                <option>15</option>
                <option>关闭</option>
            </select>
        </div>
        <div class='pay-teacher-list'>
            <div class='pay-teacher-list-left'>
                <img width='30' height='30' src='../../../static/anquan.png' />
                <span>陈老师</span>
            </div>
            <select>
                <option>15</option>
                <option>关闭</option>
            </select>
        </div>
        <div class='save-setting'>保存设置</div>
    `
    div.appendChild(top)
    div.appendChild(bottom)
    div.appendChild(autoRenew)
    div.appendChild(autoDiv)
    div.appendChild(teacherSpend)
    return div
}

let createPayHistory = () => {
    let div = document.createElement('div')
    div.className = 'setting-pay-history'
    let top = document.createElement('div')
    top.className = 'pay-top'
    top.innerHTML = `
        <div>付款历史</div>
        <div></div>
        <div></div>
        <div class='download-all'>下载全部</div>
    `
    let payDetail = document.createElement('div')
    payDetail.innerHTML = `
        <div class='pay-detail-list'>
            <div>日期</div>
            <div>课时</div>
            <div>中文科目</div>
            <div></div>
        </div>
        <div class='pay-detail-list2'>
            <div>2021年9月28日</div>
            <div>1</div>
            <div>中文口语</div>
            <div class='shouju'>收据信息</div>
        </div>
        <div class='pay-detail-list2'>
            <div>2021年9月28日</div>
            <div>1</div>
            <div>中文口语</div>
            <div class='shouju'>收据信息</div>
        </div>
    `
    let bottom = document.createElement('div')
    bottom.style.cssText = 'height:2px;background:#F6F6F6;margin-top:16px'
    let updateAccountDetail = document.createElement('div')
    updateAccountDetail.style.cssText = 'padding-bottom:21px'
    updateAccountDetail.innerHTML = `
        <div class='update-account-top'>
            <div>更新账单信息</div>
            <div></div>
            <div></div>
            <div></div>
        </div>
        <div class='update-account-btm'>
            <div class='update-account-list'>
                <span>学生姓名</span>
                <input placeholder='必填'/>
            </div>
            <div class='update-account-list'>
                <span>公司名字</span>
                <input placeholder='选填'/>
            </div>
            <div class='update-account-list'>
                <span>税号</span>
                <input placeholder='选填'/>
            </div>
            <div class='update-account-list'>
                <span>地址 1</span>
                <input placeholder='选填'/>
            </div>
            <div class='update-account-list'>
                <span>地址 2</span>
                <input placeholder='选填'/>
            </div>
            <div class='update-account-list'>
                <span>地址 3</span>
                <input placeholder='选填'/>
            </div>
        </div>
        <div class='pay-save-btn'>保存设置</div>
    `
    div.appendChild(top)
    div.appendChild(payDetail)
    div.appendChild(bottom)
    div.appendChild(updateAccountDetail)
    return div
}

let createAutoSure = () => {
    let div = document.createElement('div')
    div.className = 'setting-class-auto'
    let top = document.createElement('div')
    top.className = 'account-top'
    top.innerHTML = `
        课后自动确认
    `
    let bottom = document.createElement('div')
    bottom.style.cssText = 'padding: 26px 0px 0 43px;'
    bottom.innerHTML = `
        <div>下课15分钟，系统将自动确认，老师会收到课时费。</div>
        <div style='margin-top:11px'>如有问题，请下课后立即与我们联系。</div>
        <div style='margin-top:37px'>请确定自动确认选项</div>
        <div style='margin-top:24px'>
            <div style='display: flex;align-items: center;height: 32px;'>   
                <input type="radio" name="colors" id="yuding"><span class='yuding'>仅限于您预定的课程。</span>
            </div> 
            <div style='display: flex;align-items: center;height: 32px;margin-top:15px'>
                <input type="radio" name="colors" id="all"><span class='all'>所有课程，包括每周课程，老师安排的课程以及变更时间后的课程。</span><br>
            </div>
        </div>
    `
    let button = document.createElement('div')
    button.innerHTML = '保存'
    button.className = 'auto-sure-save'
    div.appendChild(top)
    div.appendChild(bottom)
    div.appendChild(button)
    return div
}

let createCalendar = () => {
    let div = document.createElement('div')
    div.className = 'setting-calendar-google'
    let top = document.createElement('div')
    top.className = 'account-top'
    top.innerHTML = `
        Google Calendar
    `
    // let bottom = document.createElement('div')
    // bottom.className = 'calendar-btm'
    // bottom.innerHTML = noBindGoogleCalendar()
    let bottom = isBindCalendar ? bindGoogleCalendar() : noBindGoogleCalendar()
    div.appendChild(top)
    div.appendChild(bottom)
    return div
}

let noBindGoogleCalendar = () => {
    let frag = document.createElement('div')
    frag.className = 'calendar-btm'
    frag.innerHTML = `
        <svg style="margin-left:43px;margin-top:18px;width: 54px;height:54px;border: 1px solid #eee;border-radius: 50%;" aria-hidden="true">
            <use xlink:href="#icon-dengluguge"></use>
        </svg>
        <div style='margin-top: 18px;margin-left:15px'>连接至您的Google日历，并将所有课程与您的个人日程同步</div>
        <div class='edit-google-calendar'>链接谷歌日历</div>
    `
    return frag
}

let calendarNoBindListener = () => {
    $('.edit-google-calendar')[0].addEventListener('click', (e) => {
        isBindCalendar = true
        $('.calendar-btm')[0].remove()
        $('.setting-calendar-google')[0].appendChild(bindGoogleCalendar())
        calendarBindListener()
    })
}

let calendarBindListener = () => {
    $('.edit-google-calendar')[0].addEventListener('click', (e) => {
        isBindCalendar = false
        $('.bind-google-calendar')[0].remove()
        $('.setting-calendar-google')[0].appendChild(noBindGoogleCalendar())
        calendarNoBindListener()
    })
}


let bindGoogleCalendar = () => {
    let frag = document.createElement('div')
    frag.className = 'bind-google-calendar'
    frag.innerHTML = `
        <div class='calendar-btm' style='padding-bottom: 22px;border-bottom:2px solid #F6F6F6'>
            <svg style="margin-left:43px;margin-top:18px;width: 54px;height:54px;border: 1px solid #eee;border-radius: 50%;" aria-hidden="true">
                <use xlink:href="#icon-dengluguge"></use>
            </svg>
            <div style='margin-top: 18px;margin-left:15px;flex:1'>
                <div>当前链接账户</div>
                <div>xxxxxx@gmail.com</div>
            </div>
            <div class='edit-google-calendar' style='margin-right: 47px;'>断开谷歌日历</div>
        </div>
        <div class='calendar-btm' style='padding-bottom: 22px;border-bottom:2px solid #F6F6F6'>
            <div style='margin-left: 43px;margin-top:22px;flex: 1;height: 43px;'>
                <div>将课程添加到日历中</div>
                <div>使用此设置自动将准备课程添加到连接的日历中。</div>
            </div>
            <div class='edit-google-calendar' style='margin-right: 47px;'>xxxxxx@gmail.com</div>
        </div>
        <div class='calendar-btm' style='padding-bottom: 50px;border-bottom:2px solid #F6F6F6'>
            <div style='margin-left: 43px;margin-top:22px;flex: 1;'>
                <div>检查日历是否有冲突</div>
                <div >选择要检查的日历，以安排有关准备的新课程</div>
            </div>
            <div style='width: 264px;margin-right: 47px;display: flex;margin-top: 22px;height: 40px;align-items: center;'>
                <input id='check-email' class='check-email' type='checkbox' style='margin-right:9px'/>
                <span style='color:#AFAFAF'>xxxxxx@gmail.com</span>
            </div> 
        </div>
        <div class='calendar-btm' style='margin-top:8px;align-items:flex-start;margin-bottom:29px'>
            <div style='margin-left: 43px;margin-top:22px;flex: 1;'>
                <div>上课前提醒我</div>
                <div style='margin-top:7px'>您希望我们在预定课程前多久向您发送提醒</div>
            </div>
            <div class='calendar-btm-label' >
                <label><input  type="radio" name='radio1' class="radio1" value="1" />无通知</label>
                <label><input  type="radio" name='radio1' class="radio1" value="2" />上课前15分钟</label>
                <label><input  type="radio" name='radio1' class="radio1" value="3" />上课前60分钟</label>
                <label><input  type="radio" name='radio1' class="radio1" value="4" />上课前24小时</label>
            </div>
        </div>
        <div class='calendar-btn'>保存</div>
    `
    return frag
}

let createNotice = () => {
    let div = document.createElement('div')
    div.className = 'setting-notice'
    let top = document.createElement('div')
    top.className = 'account-top'
    top.innerHTML = `
        通知
    `
    let bottom = document.createElement('div')
    bottom.className = 'notice-bottom'
    bottom.innerHTML = `
        <div class='pl-43'>Emall</div>
        <div style='display:flex;align-items:center;padding-left:18px;margin-top:20px'>
            <i class='iconfont icon-tick' style='color:#797979'></i>
            <div style='margin-left: 9px;'>Lesson scheduling</div>
        </div>
        <div style='display:flex;margin-top:21px;padding-left: 18px;'>
            <input type='checkbox' style='margin-top: 3px;' />
            <div style='display:flex;flex-direction:column;margin-left: 11px;'>
                <div>General reminders</div>
                <div>Notifications about lessons, tutor messages, and payments.</div>
            </div>
        </div>
        <div style='display:flex;margin-top:21px;padding-left: 18px;'>
            <input type='checkbox' style='margin-top: 3px;' />
            <div style='display:flex;margin-left: 11px;'>
                Updates, tips and offers
            </div>
        </div>
        <div style='padding-left: 42px;margin-top:21px'>SMS</div>
        <div style='padding-left: 42px;margin-top:8px'>Lessons and message</div>
        <div style='margin:auto;display:flex;align-items:center;justify-content:center'>
            <div class='notice-save'>保存设置</div>
            <div class='notice-tuiding'>退订所有</div>
        </div>
    `
    div.appendChild(top)
    div.appendChild(bottom)
    return div
}

let bindCardListener = () => {
    $('.save-card')[0].addEventListener('click', (e) => {
        createBindCard()
    })
}

let cardListener = () => {
    $('.card-close')[0].addEventListener('click', () => {
        $('.bind-card-dialog')[0] && $('.bind-card-dialog')[0].remove()
        $('#mask')[0].style.zIndex = '-1'
    })
}

let createBindCard = () => {
    $('#mask')[0].style.zIndex = 20
    let wrap = document.createElement('div')
    wrap.className = 'bind-card-dialog'
    wrap.innerHTML = `
        <div class='bind-card-img' >
            <img src='../../../static/anquan.png' width='48' height='56' />
        </div>
        <div class='bind-card-top'>
            <div class='bind-card-top-text'>储存付款卡</div>
            <i class='iconfont icon-chahao card-close'></i>
        </div>
        <div class='bind-card-btm'>
            <div class="item-select" id="item-select1">
                <span class="select-val">请选择</span>
                <i class="carat"></i>
                <ul class="item-select-list">
                    <li class="active-card">请选择</li>
                </ul>
            </div>
            <div>卡号</div>
            <input class='bind-input-card' type='text' placeholder='1234 1234 1234 1234'/>
            <div class='bind-other-input'>
                <div class='bind-other-valid'>
                    <div>有效期</div>
                    <input placeholder='MM/YY'/>
                </div>
                <div class='bind-other-cvv'>
                    <div>CVV</div>
                    <input placeholder='***' type='password'/>
                </div>
            </div>
            <div class='bind-card-save-btn'>确认存储</div>
        </div>
    `
    document.body.appendChild(wrap)
    createCardSelect()
    cardListener()
}

let createCardSelect = () => {
    let arr = ['icon-visa', 'icon-mastercard', 'icon-amex', 'icon-jcb1', 'icon-discover1'];
    // 遍历arr数组
    let html = '';
    for (let i = 0; i < arr.length; i++) {
        html += `<li data-id=${arr[i].split('-')[1].replaceAll(/[0-9]+/g, '').toUpperCase()}>
            <svg style="width: 40px;height:24px;padding-left:13px" aria-hidden="true">
                <use xlink:href="#${arr[i]}"></use>
            </svg>
            <span style='margin-left:10px'>${arr[i].split('-')[1].replaceAll(/[0-9]+/g, '').toUpperCase()}</span>
        </li>`
    }
    $('.item-select-list').append(html);

    // 显示下拉框
    $('#item-select1').click(function () {
        $('.item-select-list').toggleClass('active-card');
    })

    // 获取下拉框值
    $('.item-select-list').on('click', 'li', function () {
        // 获取点击了那个的值以及脚标
        let selectVal = $(this).text();
        let selectIndex = $(this).data('id');
        //			console.log(selectVal);
        //			console.log(selectIndex);

        $(this).addClass('active-card').siblings().removeClass('active-card');
        $('.select-val').html(selectVal);

    })
}


let maskListener = () => {
    $('.mask')[0].addEventListener('click', (e) => {
        $('.bind-card-dialog')[0] && $('.bind-card-dialog')[0].remove()
        $('#mask')[0].style.zIndex = '-1'
    })
}

let userSettingMap = {
    'account': createAccount,
    'password': createUserPwd,
    'payType': createPayType,
    'payHistory': createPayHistory,
    'autoSure': createAutoSure,
    'calendar': createCalendar,
    'notice': createNotice
}

let listenerMap = {
    'account': () => {
        initAccount()
        listenerPhoneAllowDown()
        createPhoneList()
    },
    'calendar': () => {
        if (!isBindCalendar) {
            calendarNoBindListener()
        } else {
            calendarBindListener()
        }
    },
    'password': () => {
        initPassword()
    },
    'payType': () => { },
    'payHistory': () => { },
    'autoSure': () => { },
    'notice': () => { },
}

let clearRight = () => {
    $('.setting-account')[0] && $('.setting-account')[0].remove()
    $('.setting-pwd')[0] && $('.setting-pwd')[0].remove()
    $('.setting-pay-history')[0] && $('.setting-pay-history')[0].remove()
    $('.setting-class-auto')[0] && $('.setting-class-auto')[0].remove()
    $('.setting-calendar-google')[0] && $('.setting-calendar-google')[0].remove()
    $('.setting-notice')[0] && $('.setting-notice')[0].remove()
    // $('.setting-pay-history')[0] && $('.setting-pay-history')[0].remove()
}

let listenerPhoneAllowDown = () => {
    $('.account-btm-div4-allow')[0].addEventListener('click',() => {
        if($('.account-btm-div4-tel-list-wrap')[0].style.display === 'none'){
            $('.account-btm-div4-tel-list-wrap').show()
            $('.account-btm-div4-tel-list-wrap')[0].style.display = 'flex'
        }else{
            $('.account-btm-div4-tel-list-wrap').hide()
        }
        
    })
}

let createUserSetting = async () => {
    return new Promise(async (resolve) => {
        component = 'account'
        let wrap = document.createElement('div')
        wrap.className = 'component-wrap'
        wrap.style.cssText = 'background-color: #EDEFF0;width: 100%;height: 100%;overflow-x:hidden'
        let div = document.createElement('div')
        div.className = 'component-setting'
        let left = document.createElement('div')
        left.className = 'setting-menu'
        left.innerHTML = `
        <div class='menu-active' data-type='account'>账户</div>
        <div data-type='password'>密码</div>
        <div data-type='payType'>付款方式</div>
        <div data-type='payHistory'>付款历史</div>
        <div data-type='autoSure'>自动确认</div>
        <div data-type='calendar'>日历</div>
        <div data-type='notice'>通知</div>
    `
        //<div data-type='autoSure'>自动确认</div>
        let right = await userSettingMap[component]()
        div.appendChild(left)
        div.appendChild(right)
        wrap.appendChild(div)
        $('.body')[0].appendChild(wrap)

        if (component === 'account') { initAccount() }
        let listener = () => {
            $('.setting-menu')[0].addEventListener('click', async (e) => {
                if (e.target.dataset.type) {
                    let type = e.target.dataset.type
                    clearRight()
                    div.appendChild(await userSettingMap[type]())
                    if (type === 'payType') { bindCardListener(); maskListener() }
                    Array.from($(e.target).parent()[0].children).forEach(item => {
                        if (item.dataset.type === type) {
                            item.className = 'menu-active'
                        } else {
                            item.className = ''
                        }
                    })
                    component = type
                    listenerMap[component]()
                }

            })
        }
        listener()
        listenerPhoneAllowDown()
        createPhoneList()
        //listener
        setTimeout(() => {
            $('.component-wrap')[0].style.opacity = 1
            resolve('ok')
        })
    })

}

export default createUserSetting

